<template>
    <div class="common-layout">
        <el-container>
            <el-header class="header">
                <div class="one">
                    <div class="img">
                        <el-avatar class="i" src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png" />
                    </div>
                    <div>
                        <span>李建安</span>
                        <span>女</span>
                        <span>76岁</span>
                        <p style="margin-bottom: -20px;">入住号:123848511315</p>
                        <span style="display:inline-block; margin-left: 300px;">身份证号：4654588465431</span>
                    </div>
                    <p style="float: right; margin-top: -70px;">入住时段
                        <el-select v-model="value" placeholder="Select" style="width: 240px;margin-right: -150px;">
                            <el-option v-for="item in time" :key="item.value" :label="item.label" :value="item.value" />
                        </el-select>
                    </p>
                    <el-radio-group v-model="labelPosition" label="label position">
                        <el-radio-button value="left">Left</el-radio-button>
                        <el-radio-button value="right">Right</el-radio-button>
                        <el-radio-button value="top">Top</el-radio-button>
                    </el-radio-group>
                </div>
            </el-header>
            <!-- <el-main>
                <el-menu class="el-menu-demo" mode="horizontal" >
                    <el-menu-item index="1">医嘱列表</el-menu-item>
                    <el-menu-item index="2">巡诊记录</el-menu-item>
                    <el-menu-item index="3">会诊记录</el-menu-item>
                    <el-menu-item index="4">个人健康体检表</el-menu-item>
                    <el-menu-item index="5">多维度健康综合评估</el-menu-item>
                </el-menu>
            </el-main> -->
            <el-main>
                <el-menu class="el-menu-demo" mode="horizontal" >
                    <el-menu-item index="1">老人基本信息设置</el-menu-item>
                    <el-menu-item index="2">家属信息设置</el-menu-item>
                    <el-menu-item index="3">老人健康信息设置</el-menu-item>
                    <el-menu-item index="4">当前护照等级</el-menu-item>
                    <el-menu-item index="5">餐费床位设置</el-menu-item>
                    <el-menu-item index="6">健康档案封面</el-menu-item>
                    <el-menu-item index="7">健康档案信息卡</el-menu-item>
                </el-menu>
            </el-main>
        </el-container>
        <div>
            <table style=" border: 1px rgb(242,242,242);">
                <tr style=" border: 1px solid;"><td colspan="6" style="text-align:center; background-color:rgb(242,242,242)">老人登记信息</td></tr>
                <tr style=" border: 1px solid;"><td style="background-color:rgb(242,242,242)">住院号</td><td>2146545</td><td style="background-color:rgb(242,242,242)">登记时间</td><td>2022-03-15</td><td>经办人</td><td>苏丽芳</td></tr>
                <tr><td colspan="6" style="text-align:center; background-color:rgb(242,242,242)">老人基本信息</td></tr>
                <tr><td style="background-color:rgb(242,242,242)">老人姓名</td><td>宋绍臣</td><td style="background-color:rgb(242,242,242)">老人身份证号</td><td>551561615132</td><td colspan="2" rowspan="5">123</td></tr>
                <tr><td style="background-color:rgb(242,242,242)">性别</td><td>男</td><td style="background-color:rgb(242,242,242)">生日</td><td>1938-08-14 年龄：84岁</td></tr>
                <tr><td style="background-color:rgb(242,242,242)">联系电话</td><td>18697296869</td><td style="background-color:rgb(242,242,242)">血型</td><td>不明</td></tr>
                <tr><td style="background-color:rgb(242,242,242)">籍贯</td><td>西宁市城东区</td><td style="background-color:rgb(242,242,242)">民族</td><td>汉族</td></tr>
                <tr><td style="background-color:rgb(242,242,242)">婚姻状况</td><td>丧偶</td><td style="background-color:rgb(242,242,242)">宗教信仰</td><td>无宗教信仰</td></tr>
                <tr><td style="background-color:rgb(242,242,242)">文化程度</td><td>小学毕业</td><td style="background-color:rgb(242,242,242)">是否签订合同</td><td colspan="3">是</td></tr>
                <tr><td style="background-color:rgb(242,242,242)">新住址</td><td>西宁市城东区八一路63号</td><td style="background-color:rgb(242,242,242)">户籍住址</td><td colspan="3">西宁市城东区八一路63号</td></tr>
                <tr><td style="background-color:rgb(242,242,242)">是否本地户籍</td><td>是</td><td style="background-color:rgb(242,242,242)">原居住情况</td><td colspan="3">与子女居住</td></tr>
                <tr><td style="background-color:rgb(242,242,242)">医保卡号码</td><td></td><td style="background-color:rgb(242,242,242)">入住类型</td><td colspan="3">新入住</td></tr>
            </table>
        </div>
    </div>
</template>
    
    
<script lang="ts" setup>
import { Search } from "@element-plus/icons-vue";
import { ref } from "vue";
import { ElMessage, ElMessageBox } from "element-plus";
import { ElNotification } from "element-plus";
import type { TabsPaneContext } from 'element-plus'

const activeName = ref('first')

const handleClick = (tab: TabsPaneContext, event: Event) => {
    console.log(tab, event)
}
const value = ref("")
const labelPosition = ''

const time = [{
    value: '2022-2023', label: '2022-2023'
}, {
    value: '2022-2023', label: '2022-2023'
}, {
    value: '2022-2023', label: '2022-2023'
},]

</script>
    
    
<style scoped>
.common-layout {
    width: 1200px;
    height: 1000px;
}
table{
    text-align: center;
    margin-top: -600px;
    width: 1000px;
    height: 600px;
}
.header {
    width: 1000px;
    height: 300px;
    background-color: aliceblue;
    
}
.el-menu-demo{
    width: 2000px;
}
.el-menu-item {
    width: 150px;
}
td{
    border: 1px solid rgb(242,242,242);
}
.one {
    width: 800px;
    height: 100px;
}

img {
    width: 100px;
    height: 100px;
}

span {
    display: inline-block;
    margin-right: 30px;
    margin-bottom: 20px;
}

.img {
    float: left;
    border-radius: 10px;
}

.demo-tabs>.el-tabs__content {
    padding: 32px;
    color: #6b778c;
    font-size: 32px;
    font-weight: 600;
}

.i {
    width: 70px;
    height: 70px;
}
</style>